
import 'package:flutter/material.dart';

class SliverPage extends StatelessWidget {
  const SliverPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: CustomScrollView(
        slivers: [
          // 可折叠的 AppBar
          SliverAppBar(
            pinned: true,
            expandedHeight: 200,
            flexibleSpace: FlexibleSpaceBar(
              title: const Text('Sliver 示例'),
              background: Image.network(
                'https://picsum.photos/800/400',
                fit: BoxFit.cover,
              ),
            ),
          ),

          // 普通列表
          SliverList(
            delegate: SliverChildBuilderDelegate(
                  (context, index) => ListTile(
                title: Text('列表项 $index'),
              ),
              childCount: 5,
            ),
          ),

          // 网格布局
          SliverGrid(
            delegate: SliverChildBuilderDelegate(
                  (context, index) => Container(
                color: Colors.blue[100 * ((index % 8) + 1)],
                child: Center(child: Text('网格 $index')),
              ),
              childCount: 8,
            ),
            gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
              crossAxisCount: 2,
              mainAxisSpacing: 10,
              crossAxisSpacing: 10,
              childAspectRatio: 1.0,
            ),
          ),

          // 填充间距
          const SliverPadding(
            padding: EdgeInsets.all(20),
            sliver: SliverToBoxAdapter(
              child: Text(
                '这是 SliverToBoxAdapter 插入的普通组件',
                style: TextStyle(fontSize: 18),
              ),
            ),
          ),

          // 结束空白
          const SliverToBoxAdapter(
            child: SizedBox(height: 50),
          ),
        ],
      ),
    );
  }
}
